* {
  border: none;
  background: none;
  color: #ccc;
  font-size: 17px;
}

p,
pre {
  white-space: pre-wrap;
  word-wrap: break-word;
}

body {
  background-color: #222;
}

header {
  background-color: #333a;
}

header p {
  display: inline;
  margin-right: 15px;
}

div#主内容 {
  left: 100%;
}

div#主内容 {
  left: 0;
  transition: 0.8s;
  position: relative;
}

div#主内容 div {
  position: absolute;
  display: inline-flex;
  top: 0;
  width: 100%;
}

div#主内容 div:nth-child(1) {
  left: 0%;
}

div#主内容 div:nth-child(2) {
  left: 110%;
}

div#主内容 div:nth-child(3) {
  left: 220%;
}

div#主内容 div:nth-child(4) {
  left: 330%;
}

div#主内容 div:nth-child(5) {
  left: 440%;
}

div#主内容 div:nth-child(6) {
  left: 550%;
}

div#主内容 div:nth-child(7) {
  left: 660%;
}

header p:nth-child(1) {
  color: #c33;
}
